<template>
  <div class="app-container calendar-list-container">
    <el-table
      :data="tableData6"
      :span-method="objectSpanMethod"
      border
      style="width: 100%">
      <el-table-column prop="class_room_name" label="课室" width="180"></el-table-column>
      <el-table-column prop="time" label="上课时间" width="180"></el-table-column>
      <el-table-column label="2018-01-25">
        <template slot-scope="scope">
          {{scope.row['20180125'].course_name}}
        </template>
      </el-table-column>
      <el-table-column label="2018-01-25">
        <template slot-scope="scope">
          {{scope.row['20180126'].course_name}}
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { GetAllSchdulesCourse } from '@/api/schedule'

export default {
  data() {
    return {
      tableData6: [
        {
          class_room_name: '测试课室',
          time: '12:00 - 13:00',
          '2018-01-25': {
            course_name: '测试课程'
          },
          '2018-01-26': {
            course_name: '测试课程'
          }
        },
        {
          class_room_name: '测试课室',
          time: '12:00 - 13:00',
          '2018-01-25': {
            course_name: '测试课程'
          },
          '2018-01-26': {
            course_name: '测试课程'
          }
        }
      ]
    }
  },
  created() {
    this.loadTable()
  },
  methods: {
    async loadTable() {
      // this.listLoading = true
      const res = await GetAllSchdulesCourse({ start_date: '2018-01-25', end_date: '2018-01-26' })
      console.log(res)
      const array = []
      res.data.forEach((item, index) => {
        array[index] = {

          [this.weeksAndDate[0].ydate]: item
        }
      })
      console.log('array', array)
      console.log('weeksAndDate', this.weeksAndDate)
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        if (rowIndex % 2 === 0) {
          return {
            rowspan: 2,
            colspan: 1
          }
        } else {
          return {
            rowspan: 0,
            colspan: 0
          }
        }
      }
    },
    today(w) {
      const dd = new Date()
      let y = dd.getFullYear()
      let m = dd.getMonth() + 1// 获取当前月份的日期
      let d = dd.getDate()
      y = y.toString()
      m = m.toString()
      d = d.toString()
      if (d.length === 1) d = '0' + d
      if (m.length === 1) m = '0' + m
      if (w) return m + '-' + d
      return y + '-' + m + '-' + d
    },
    AddDays(date, days, n) {
      let nd = new Date(date)
      nd = nd.valueOf()
      nd = nd + days * 24 * 60 * 60 * 1000
      nd = new Date(nd)
      const y = nd.getFullYear()
      let m = nd.getMonth() + 1
      let d = nd.getDate()
      if (m <= 9) m = '0' + m
      if (d <= 9) d = '0' + d
      let cdate = y + '-' + m + '-' + d
      if (n) cdate = m + '-' + d
      if (n === 'day') cdate = d
      return cdate
    }
  },
  computed: {
    weeksAndDate() {
      const defalutWeek = ['日', '一', '二', '三', '四', '五', '六']
      const weeksAndDate = []
      for (let i = 0; i < 7; i += 1) {
        weeksAndDate[i] = {
          week: defalutWeek[new Date(this.AddDays(this.today(), i)).getDay()],
          date: this.AddDays(this.today(), i, 1),
          ydate: this.AddDays(this.today(), i),
          day: this.AddDays(this.today(), i, 'day')
        }
      }
      return weeksAndDate
    }
  }
}
</script>
